<template>
    <div class="sx-personalCenter-index">
        <div class="sx-personalCenter-container">
            <div class="sx-personalCenter-content">
                <router-view></router-view>
            </div>
            <div class="sx-personalCenter-nav">
                <ul>
                    <li><router-link :to="{ path: '/personalCenter/handleCommunityApproval' }">处理社团审批</router-link></li>
                    <li><router-link to="">查看审批进度</router-link></li>
                    <li><router-link to="">已参加的社团</router-link></li>
                    <li><router-link to="">已参加的活动</router-link></li>
                    <li><router-link to="">申请创建社团</router-link></li>
                </ul>
            </div>
        </div>
    </div>
</template>

<script>
// import describe from './components/describe.vue'
export default{
    name: 'personalCenterIndex',
    components: {
    }
}
</script>

<style lang="scss">
.sx-personalCenter-index{
    box-sizing: border-box;
    padding: 40px;
    width: 100%;
    background: rgb(126, 226, 226);
    overflow: hidden;
    .sx-personalCenter-container{
        width: 1020px;

    }
}

.sx-personalCenter-nav{
    box-sizing: border-box;
    padding: 10px;
    border-radius: 5px;
    float: right;
    width: 200px;
    background-color: rgb(255, 255, 255);
    & ul li{
        text-align: center;
        padding: 10px;
    }
}
.sx-personalCenter-content{
    border-radius: 5px;
    box-sizing: border-box;
    padding: 20px;
    float: left;
    width: 800px;
    background-color: rgb(255, 255, 255);
}
</style>